<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title><%= title %></title>
    <link href="/image/favicon.ico" rel="shortcut icon" />
    <link rel="stylesheet" href="//at.alicdn.com/t/font_726304_1dxou5nc7bu.css">
    <link rel="stylesheet" href="/css/swiper.min.css">
    <link rel="stylesheet" href="/mcss/base.css">
    <link rel="stylesheet" href="/mcss/mtcggame.css">
</head>
<body>
    <div class="mtcgexchange">
        <!-- header头部 -->
        <header class="mtcggame-header boxsizing">
                <div class="tcglogo">
                    <a href="/m">
                        <img src=""
                        class="img-responsive" alt="HPS-TCG" />
                    </a>
                </div>
                <div class="tcgbanlance">
                    <div class="tcg-mybanlance"><%= __('tcgbanlancetit') %><span class="banlancetip" v-html="userinfo.myagbanlance"></span></div>
                    <div class="tcg-coin">
                        <div class="tcg-coindefault" @click="exchange.isshowcoinarr=!exchange.isshowcoinarr">
                            <img :src="'/image/'+exchange.defaultcoin+'.png'" :alt="exchange.defaultcoin">
                            <span class="tcg-coinname" v-html="exchange.defaultcoin"></span>
                            <i class="icon iconfont icon-sanjiaodown"></i>
                        </div>
                        <% if(allMine.length){ %>
                            <ul class="tcg-choosecoin" v-show="exchange.isshowcoinarr">
                                <% allMine.forEach( (item,index) => { %>
                                    <li @click="changeexchangecoin('<%= item.coin %>','<%= item.balance %>')">
                                        <img src="/image/<%= item.coin %>.png" alt="">
                                        <span><%- item.coin %></span>
                                    </li>
                                <% }) %>
                            </ul>
                        <% } %>
                    </div>
                </div>
        </header>
        <!--兑换内容  -->
        <div class="mtcgexchange-container">
            <!-- TCG兑换tab -->
            <div class="tcgexchange">
                <div :class="{active:showtransforminag}" @click="tcgtabchange('showtransforminag')"><%= __('tcgexchange1') %></div>
                <div :class="{active:showtransformout}" @click="tcgtabchange('showtransformout')"><%= __('tcgexchange2') %></div>
            </div>
            <!-- TCG兑换内容 -->
            <div class="tcgexchange-box">
                <!-- 兑换AG分 -->
                <div class="transforminbox transformbox" v-show="showtransforminag">
                        <div class="transform-form">
                            <div class="form-item <%= lang %>">
                                <label class="item-label"><%= __('Currencyexchange') %></label>
                                <div class="item-label">
                                    <span v-html="exchange.defaultcoin"></span>
                                </div>
                            </div>
                            <!-- 兑换比例 -->
                            <div class="form-item form-bigmg <%= lang %>">
                                <label class="item-label"><%= __('Exchangequantity') %></label>
                                <div class="item-input">
                                    <input type="number" class="form-input" v-model="exchangenum">
                                </div>
                            </div>
                            <div class="form-item <%= lang %>">
                                <label class="item-label"><%= __('Youwillget') %></label>
                                <div class="item-tip">
                                    <span v-html="exchange.exchangeagcoin"></span>
                                </div>
                                <label class="item-label"><%= __('TCGPoints') %></label>
                            </div>
                        </div>
                        <div class="postformbox">
                            <button class="postform" @click="confirmexchange" :disabled="exchange.disabledbtn"><%= __('Confirmexchange') %></button>
                        </div>
                    </div>
                    <!-- 兑出AG分 -->
                    <div class="transformoutbox transformbox" v-show="showtransformout">
                        <div class="transform-form">
                            <!-- 兑换比例 -->
                            <div class="form-item <%= lang %>">
                                <label class="item-label"><%= __('CashOuttcgpoints') %></label>
                                <div class="item-input">
                                    <input type="text" class="form-input" v-model="cashoutnum">
                                </div>
                            </div> 
                            <!-- 换算币种值 -->
                            <div class="form-item form-bigmg <%= lang %>">
                                <label class="item-label"><%= __('Youwillget') %></label>
                                <div class="item-tip">
                                    <span v-html="cashout.exchangeagcoin"></span>
                                </div>
                                <label class="item-label" v-html="exchange.defaultcoin"></label>
                            </div> 
                        </div>
                        <div class="postformbox">
                            <button class="postform" @click="confircashout" :disabled="cashout.disabledbtn"><%= __('Confirmation') %></button>
                        </div>
                    </div>
            </div>
        </div>
        <!-- TCG固定顶部 -->
        <div class="tcggameft">
            <div class="tcggame-fixedbody">
                <div class="tcgfixed-nav">
                    <a href="/m">
                        <div class="tcgnav-icon"><i class="icon iconfont icon-shouye"></i></div>
                        <div class="tcgnav-txt"><%= __('tcgftnav1') %></div>
                    </a>
                </div>
                <div class="tcgfixed-nav">
                    <a href="/m/tcggame">
                        <div class="tcgnav-icon"><i class="icon iconfont icon-94"></i></div>
                        <div class="tcgnav-txt"><%= __('tcgftnav2') %></div>
                    </a>
                </div>
                <div class="tcgfixed-nav">
                    <a href="/m/mtcgexchange">
                        <div class="tcgnav-icon"><i class="icon iconfont icon-youxianzijin"></i></div>
                        <div class="tcgnav-txt"><%= __('tcgftnav3') %></div>
                    </a>
                </div>
            </div>
        </div>
    </div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.2/js/swiper.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script src="/mjs/mtcgexchange.js"></script>
</body>
</html>